<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'list.jsp' starting page</title>
    
	<%@include file="/WEB-INF/jsp/public/commons.jspf" %>
	
	<style type="text/css">
		#mysearch{
			text-align: center;
		}
	
	</style>
	
	<script type="text/javascript">
			$(function(){
					
					// 自定义的校验器
			$.extend($.fn.validatebox.defaults.rules, {   
    				midLength: {   
       			 			validator: function(value, param){   
            								return value.length >= param[0] && value.length <= param[1];    
        					},   
        					message: ''  
					} ,
					equalLength : {
       			 			validator: function(value, param){   
            								return value.length == param[0];    
        					},   
        					message: '学号必须为10个字符!'  
					}
			}); 
					
					
					var flag ;		//undefined 判断新增和修改方法 
					  
					
					/**
					 *	初始化数据表格  
					 */
					$('#t_user').datagrid({
							idField:'id' ,		//只要创建数据表格 就必须要加 ifField
							title:'学生 列表' ,
							//width:1300 ,
							fit:true ,
							height:450 ,
							url:'student_listJson.action' ,
							fitColumns:true ,  
							striped: true ,					//隔行变色特性 
							loadMsg: '数据正在加载,请耐心的等待...' ,
							rownumbers:true ,
							rowStyler: function(index ,record){
							
							} ,
							frozenColumns:[[				//冻结列特性 ,不要与fitColumns 特性一起使用 
								{
									field:'ck' ,
									width:50 ,
									checkbox: true
								}
							]],
							columns:[[
								{
									field:'name' ,
									title:'姓名 ' ,
									width:150 ,
									align:'center' ,
									
								},{
									field:'loginName' ,
									title:'登录名' ,
									width:150 , 
									align:'center' ,
								},
								{
									field:'password' ,
									title:'密码' ,
									width:150 , 
									align:'center' ,
									hidden:true
								},
								{
									field:'stuNum' ,
									title:'学号' ,
									width:150 , 
									align:'center' ,
										
									
								},
								{
									field:'direction' ,
									title:'专业' ,
									width:150 , 
									align:'center' ,
									formatter:function(value , record , index){

										if(value != null){
											return '<span title='+value.id+'>'+value.name+'</span>';
										}
									}
								},
								
								{
									field:'entryYear' ,
									title:'入学年份' ,
									width:150 , 
									align:'center' ,
								},
								
								
							]] ,
							pagination: true , 
							pageSize: 10 ,
							pageList:[5,10,15,20,50] ,
							toolbar:[
								{
									text:'新增' ,
									iconCls:'icon-add' , 
									handler:function(){
										flag = 'add';
										$('#mydialog').dialog({
												title:'新增学生' 
										});
										
										$('#myform').get(0).reset();
										$('#mydialog').dialog('open');
									
									}
									
								},{
									text:'修改' ,
									iconCls:'icon-edit' , 
									handler:function(){
										flag = 'edit';
										var arr =$('#t_user').datagrid('getSelections');
											
										if(arr.length != 1){
											$.messager.show({
												title:'提示信息!',
												msg:'只能选择一行记录进行修改!'
											});
										} else {
											$('#mydialog').dialog({
												title:'修改学生'
											});
											$('#mydialog').dialog('open'); //打开窗口
											$('#myform').get(0).reset();   //清空表单数据 
											
										
											
											$('#myform').form('load',{	   //调用load方法把所选中的数据load到表单中,非常方便
												id:arr[0].id ,
												name:arr[0].name ,
												loginName:arr[0].loginName,
												password:arr[0].password,
												stuNum:arr[0].stuNum,
												directionId:arr[0].direction.name,
												entryYear:arr[0].entryYear
												
																						
											});
											
										}
									
									}
								},{
									text:'删除' ,
									iconCls:'icon-remove' , 
									handler:function(){
											var arr =$('#t_user').datagrid('getSelections');
											if(arr.length <=0){
												$.messager.show({
													title:'提示信息!',
													msg:'至少选择一行记录进行删除!'
												});
											} else {
												
												$.messager.confirm('提示信息' , '确认删除?' , function(r){
														if(r){
																var ids = '';
																for(var i =0 ;i<arr.length;i++){
																	ids += arr[i].id + ',' ;
																}
																ids = ids.substring(0 , ids.length-1);
																$.post('student_deleteByIds.action', {ids:ids} , function(result){
																	//1 刷新数据表格 
																	$('#t_user').datagrid('reload');
																	//2 清空idField   
																	$('#t_user').datagrid('unselectAll');
																	//3 给提示信息 
																	$.messager.show({
																		title:'提示信息!' , 
																		msg:'操作成功!'
																	});
																});
														} else {
															return ;
														}
												});
											}
									}								
								},
								{
									text:'初始化密码' , 
									iconCls:'icon-reload' , 
									handler:function(){
											var arr =$('#t_user').datagrid('getSelections');
											
											if(arr.length != 1){
												$.messager.show({
												title:'提示信息!',
												msg:'只能选择一行记录进行修改!'
											});
											} else {
												$.post("student_initPassword.action",{id:arr[0].id},function (){
													$.messager.show({
														title:'提示信息!',
														msg:'初始化密码成功!'
														
													});
													$('#t_user').dataGrid('reload');
												})
											
											}
											
											
											
									}
								}	
								
							]
					});
					
					
					/**
					 *  提交表单方法
					 */
					$('#btn1').click(function(){
							if($('#myform').form('validate')){
								$.ajax({
									type: 'post' ,
									url: flag=='add'?'student_add.action':'student_edit.action' ,
									cache:false ,
									data:$('#myform').serialize() ,
									dataType:'json' ,
									success:function(result){
										//1 关闭窗口
										$('#mydialog').dialog('close');
										//2刷新datagrid 
										$('#t_user').datagrid('reload');
										//3 提示信息
										$.messager.show({
											title:'操作 ' , 
											msg:'操作成功!'
										});
									} ,
									error:function(result){
										$.messager.show({
											title:'操作 ' , 
											msg:'操作失败!'
										});
									}
								});
							} else {
								$.messager.show({
									title:'提示信息!' ,
									msg:'数据验证不通过,不能保存!'
								});
							}
					});
					
					
					/**
					 * 关闭窗口方法
					 */
					$('#btn2').click(function(){
						$('#mydialog').dialog('close');
					});
					
						
					$('#searchbtn').click(function(){
						$('#t_user').datagrid('load' ,serializeForm($('#mysearch')));
					});
					
					$('#clearbtn').click(function(){
						$('#mysearch').form('clear');
						$('#t_user').datagrid('load' ,{});
					});
					

			});
			
			//js方法：序列化表单 			
			function serializeForm(form){
				var obj = {};
				$.each(form.serializeArray(),function(index){
					if(obj[this['name']]){
						obj[this['name']] = obj[this['name']] + ','+this['value'];
					} else {
						obj[this['name']] =this['value'];
					}
				});
				return obj;
			}

	</script>
	
  </head>
  
  <body>
			<div id="lay" class="easyui-layout" style="width: 100%;height:100%" >
				<div region="north" title="查询" collapsed=true style="height:55px;overflow: hidden" >
					
				
				</div>
				<div region="center" >
					<table id="t_user"></table>
				</div>
			</div>
  			
 			<div id="mydialog" title="新增学生" modal=true  draggable=false class="easyui-dialog" closed=true style="width:300px;">
	    		<form id="myform" action="" method="post">
	    				<input type="hidden" name="id"/>
	    				<table>
	    					<tr>
	    						<td>姓名:</td>
	    						<td><input type="text" name="name" class="easyui-validatebox" required=true validType="midLength[2,10]" missingMessage="用户名称必填!" invalidMessage="必须在2到10个字符之间!" /></td>
	    					</tr>
	    					<tr>
	    						<td>登录名:</td>
	    						<td><input type="text" name="loginName"  class="easyui-validatebox" required=true validType="midLength[2,10]" missingMessage="登录用户名必填!" invalidMessage="必须在2到10个字符之间!"/> </td>
	    					</tr> 
	    					<tr>
	    						
	    						<td><input type="hidden" name="password" /> </td>
	    					</tr> 
	    					<tr>
	    						<td>学号:</td>
	    						<td>
	    						<input type="text" name="stuNum" required=true  class="easyui-combobox" validType="equalLength[10]" missingMessage="学号必填!"/>
	    						</td>
	    					</tr> 
	    					<tr>
	    						<td>专业:</td>
	    						<td><input type="text"  class="easyui-combobox" name="directionId" url="student_getAllDirection.action" valueField="id" textField="name" required=true missingMessage="专业必填!"/></td>
	    					</tr> 
	    					<tr>
	    						<td>入学年份:</td>
	    						<td><input type="text" class="easyui-DateBox" name="entryYear" required=true missingMessage="日期必填!"/></td>
	    					</tr> 
	    					
	    					
	    					<tr align="center">
	    						<td colspan="2">
	    							<a id="btn1" class="easyui-linkbutton">确定</a>
	    							<a id="btn2" class="easyui-linkbutton">关闭</a>
	    						</td>
	    					</tr>   					 					    					    					    					    					    					    					    					
	    				</table>
	    		</form> 			
 			</div>
 			
 			
  </body>
</html>
